<template>
	<view>
		<template v-for="(item, index) in options">
			<template v-if="item.type=='l-row'">
				<l-row :option="item.option" :compStyle="item.compStyle"></l-row>
			</template>
			<template v-else-if="item.type=='l-button'">
				<l-button :option="item.option" :compStyle="item.compStyle"></l-button>
			</template>
			<!-- <template v-else-if="item.type=='l-col'">
				<l-col :option="item.option" :compStyle="item.compStyle"></l-col>
			</template> -->
		<!-- 	<template v-else-if="item.type=='l-tabbar'">
				<l-tabbar :option="item.option" :compStyle="item.compStyle"></l-tabbar>
			</template>
			<template v-else-if="item.type=='l-gap'">
				<l-gap :option="item.option" :compStyle="item.compStyle"></l-gap>
			</template>
			<template v-else-if="item.type=='l-form-input'">
				<l-form-input :option="item.option" :compStyle="item.compStyle"></l-form-input>
			</template>
			<template v-else-if="item.type=='l-me'">
				<l-me :option="item.option" :compStyle="item.compStyle"></l-me>
			</template>
			<template v-else-if="item.type=='l-form-input'">
				<l-form-input :option="item.option" :compStyle="item.compStyle"></l-form-input>
			</template>
			<template v-else-if="item.type=='l-card'">
				<l-card :option="item.option" :compStyle="item.compStyle"></l-card>
			</template>
			<template v-else-if="item.type=='l-cell'">
				<l-cell :option="item.option" :compStyle="item.compStyle"></l-cell>
			</template>
			<template v-else-if="item.type=='l-chart-line'">
				<l-chart-line :option="item.option" :compStyle="item.compStyle"></l-chart-line>
			</template>
			<template v-else-if="item.type=='l-chart-pie'">
				<l-chart-pie :option="item.option" :compStyle="item.compStyle"></l-chart-pie>
			</template>
			<template v-else-if="item.type=='l-form-input-map'">
				<l-form-input-map :option="item.option" :compStyle="item.compStyle"></l-form-input-map>
			</template>
			<template v-else-if="item.type=='l-form'">
				<l-form :option="item.option" :compStyle="item.compStyle"></l-form>
			</template>
			<template v-else-if="item.type=='l-form-checkboxes'">
				<l-form-checkboxes :option="item.option" :compStyle="item.compStyle"></l-form-checkboxes>
			</template>
			<template v-else-if="item.type=='l-form-input-time'">
				<l-form-input-time :option="item.option" :compStyle="item.compStyle"></l-form-input-time>
			</template>
			<template v-else-if="item.type=='l-form-radio'">
				<l-form-radio :option="item.option" :compStyle="item.compStyle"></l-form-radio>
			</template>
			<template v-else-if="item.type=='l-form-rate'">
				<l-form-rate :option="item.option" :compStyle="item.compStyle"></l-form-rate>
			</template>
			<template v-else-if="item.type=='l-form-slider'">
				<l-form-slider :option="item.option" :compStyle="item.compStyle"></l-form-slider>
			</template>
			<template v-else-if="item.type=='l-form-checkboxes'">
				<l-form-checkboxes :option="item.option" :compStyle="item.compStyle"></l-form-checkboxes>
			</template>
			<template v-else-if="item.type=='l-form-switch'">
				<l-form-switch :option="item.option" :compStyle="item.compStyle"></l-form-switch>
			</template>
			<template v-else-if="item.type=='l-form-numberbox'">
				<l-form-numberbox :option="item.option" :compStyle="item.compStyle"></l-form-numberbox>
			</template>
			<template v-else-if="item.type=='l-grid'">
				<l-grid :option="item.option" :compStyle="item.compStyle"></l-grid>
			</template>
			<template v-else-if="item.type=='l-image'">
				<l-image :option="item.option" :compStyle="item.compStyle"></l-image>
			</template>
			<template v-else-if="item.type=='l-lottery'">
				<l-lottery :option="item.option" :compStyle="item.compStyle"></l-lottery>
			</template>
			<template v-else-if="item.type=='l-menu'">
				<l-menu :option="item.option" :compStyle="item.compStyle"></l-menu>
			</template>
			<template v-else-if="item.type=='l-login'">
				<l-login :option="item.option" :compStyle="item.compStyle"></l-login>
			</template>
			<template v-else-if="item.type=='l-swiper'">
				<l-swiper :option="item.option" :compStyle="item.compStyle"></l-swiper>
			</template>
			<template v-else-if="item.type=='l-tabs'">
				<l-tabs :option="item.option" :compStyle="item.compStyle"></l-tabs>
			</template>
			<template v-else-if="item.type=='l-subsection'">
				<l-subsection :option="item.option" :compStyle="item.compStyle"></l-subsection>
			</template>
			<template v-else-if="item.type=='l-parse'">
				<l-parse :option="item.option" :compStyle="item.compStyle"></l-parse>
			</template> -->
			<!-- 	<component v-for="(item, index) in options" :key="index" :is="item.type" :option="item.option"
			:compStyle="item.compStyle"></component> -->
		</template>
	</view>
</template>

<script>
	
	export default {
		// components: {
		// 	RParse,
		// 	rCard,
		// 	rCell,
		// 	rChartLine,
		// 	rChartPie,
		// 	rFormInput,
		// 	rButton,
		// 	RFormInputMap,
		// 	RForm,
		// 	rDataoptions,
		// 	rChartRadar,
		// 	RFormCheckboxes,
		// 	RFormInputTime,
		// 	RFormRadio,
		// 	RFormRate,
		// 	RFormSlider,
		// 	RFormSwitch,
		// 	RFormNumberbox,
		// 	RGrid,
		// 	RImage,
		// 	RLogin,
		// 	RLottery,
		// 	RMe,
		// 	RMenu,
		// 	RSwiper,
		// 	RTabs,
		// 	RSubsection
		// },
		name: 'l-vue-page-item',
		props: {
			options: {
				type: Array,
				require: true
			}
		},
		data() {
			return {

			}
		}
	};
</script>

<style lang="scss">
</style>
